<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:p="http://primefaces.org/ui">
<h:head>
	<link href="../../css/component.css" rel="stylesheet" type="text/css" />
    <style>
        .ui-picklist.picklist1 .ui-picklist-list{
            height:500px;
            width: 450px
        }
    </style>
</h:head>



<ui:param name="bean" value="#{biMonitorUserGroupAction}" />

<h:body>
    <span class="pagetitle">告警管理—— 用户组别配置</span>
    <p:separator />
	<h:form id="ulist">
	<p:growl id="msg" showDetail="true" escape="false" life="1000" />
	<p:panel id="panel1" header="组别选择"	style="text-align:center; margin:2%;">
			<br/>
			<h:panelGrid id="panel2" columns="2" cellpadding="2" style="margin: 0 auto;">
				<p:outputLabel value="当前组别"/>
				<p:selectOneMenu value="#{bean.groupId}" label="当前组别">
					<f:selectItem itemLabel="选择组别" itemValue="0" />
					<f:selectItems value="#{bean.groupMap.entrySet()}" var="entry"	itemLabel="#{entry.value.groupName}" itemValue="#{entry.key}" />
					 <p:ajax event="change" listener="#{bean.init()}" update=":ulist"/>
				</p:selectOneMenu>
			</h:panelGrid>	
			
			<br/>
			<h:panelGrid id="panel3" columns="1" cellpadding="2" style="margin: 0 auto;">
				<p:pickList id="pojoPickList"  styleClass="picklist1" value="#{bean.users}" var="user" converter="pickListConverter" itemValue="#{user}" itemLabel="#{user.userName}" showCheckbox="true" responsive="true">
		        <f:facet name="sourceCaption">未选用户</f:facet>
		        <f:facet name="targetCaption">已选用户</f:facet>
		        <p:column style="width:100%;">
		            <h:outputText value="#{user.userName}" />
		        </p:column>
		    </p:pickList>
			</h:panelGrid>	
			<br/>		 
		    <p:commandButton id="pojoSubmit" value="保存" update=":ulist"  action="#{bean.save()}" ajax="true" />
   </p:panel>
</h:form>
</h:body>
</html>